<template>
  <div class="contents">
		<div class="growhead" color="#000">
			<van-nav-bar
			title="种草详情"
			left-text="返回"
			left-arrow
			@click-left="onClickLeft"
			/>
		</div>
		<ul>
			<li>
				<section class="growtext">
					<div class="userimg">
						<img class="touxiang" src="./../assets/img/userimg1.jpg" alt="">
						<aside class="nameandtime">
							<span>韩梅梅</span><br/>
							<span class="nametime">13352335664</span>
						</aside>
					</div>
					<div class="userpl">
						<h4>把家具预算留给它! ！！</h4>			
						<p>到了秋冬，小包的搭配优势尤为明显!</p>
						<img class="talkimg" src="./../assets/img/userimg1.jpg" alt="">
						<router-link to="goodsdetail" tag="div" class="commodity">商品链接</router-link>
						<aside class="growIntroduction">
							<p class="introduction">衣服太多，再加上鞋包的不断增加，导致整个衣柜看起来十分凌乱，但是有了这款组合家具，让你的衣服再也不怕“拥挤”了。</p> 					
							<p class="shoptext">家具是人类维持日常生活，从事生产实践和开展社会活动必不可少的物质器具。家具的历史可以说同人类的历史一样悠久，它随着社会的进步而不断发展，反映了不同时代人类的生活和生产力水平，融科学、技术、材料、文化和艺术于一体。家具除了是一种具有实用功能的物品外，更是一种具有丰富文化形态的艺术品。几千年来，家具的设计和建筑、雕塑、绘画等造型艺术的形式与风格的发展同步，成为人类文化艺术的一个重要组成部分。所以，家具的发展进程，不仅反映了人类在物质文明的发展，也显示了人类精神文明的进步。								
							</p>
							<img class="Introductionimg" src="./../assets/img/userimg1.jpg">
							<p class="shoptext">家具是人类维持日常生活，从事生产实践和开展社会活动必不可少的物质器具。家具的历史可以说同人类的历史一样悠久，它随着社会的进步而不断发展，反映了不同时代人类的生活和生产力水平，融科学、技术、材料、文化和艺术于一体。家具除了是一种具有实用功能的物品外，更是一种具有丰富文化形态的艺术品。几千年来，家具的设计和建筑、雕塑、绘画等造型艺术的形式与风格的发展同步，成为人类文化艺术的一个重要组成部分。所以，家具的发展进程，不仅反映了人类在物质文明的发展，也显示了人类精神文明的进步。								
							</p>
							<img class="Introductionimg" src="./../assets/img/userimg1.jpg">
						</aside>					
					</div>
					<span class="plnumber">评论(18)</span>
					<ul class="Grassreview">
						<li>
							<aside class="everyreview">
								<img class="reviewimg" src="./../assets/img/userimg1.jpg">
								<div class="reviewright">
									<h6>小红花</h6>
									<p>真好看</p>
									<span>32分钟前</span>
								</div>
								<a href="#">赞</a>
							</aside>
						</li>
						<li>
							<aside class="everyreview">
								<img class="reviewimg" src="./../assets/img/userimg1.jpg">
								<div class="reviewright">
									<h6>小红花</h6>
									<p>真好看</p>
									<span>32分钟前</span>
								</div>
								<a href="#">赞</a>
							</aside>
						</li>
						<li>
							<aside class="everyreview">
								<img class="reviewimg" src="./../assets/img/userimg1.jpg">
								<div class="reviewright">
									<h6>小红花</h6>
									<p>真好看</p>
									<span>32分钟前</span>
								</div>
								<a href="#">赞</a>
							</aside>
						</li>
					</ul>
					<aside class="loadmore">
						查看全部评论
						<span class="iconfont icon-gengduo"></span>
					</aside>
				</section>
			</li>
		</ul>
  </div>
</template>

<script>
import Vue from 'vue'
import Header from './Header'
import { NavBar } from 'vant';

Vue.use(NavBar);
export default {
	data () {
		return {}
	},
	methods: {
	  onClickLeft () {
		this.$router.go(-1);
	  }
	},
	components: {
		Header
	}
}

</script>

<style lang="scss" scoped="scoped">
	.grownav{
		font-size:0.14rem;
		text-align: center;
	}
	.growtext{
		margin:0 0.06rem 0 0.06rem;
		.userimg {
			margin-top:0.1rem;
			display: flex;
			align-items: center;
			height:0.71rem;
			.nameandtime{
				height:0.71rem;
				font-size:0.12rem;
				span{				
					margin:0 0 0 0.1rem;
					padding:0;
					line-height:0;
				}
				.nametime{
					line-height:0.12rem;
					display: inline-block;
					height:0.12rem;
					margin-top:0.2rem;
				}
			}
		}
		.touxiang{
			width:0.71rem;
			height:0.71rem;
			float: left;
			margin-left: 11px;
			border-radius: 50%;
		}
		span{
			margin-left:0.13rem;
			line-height: 0.47rem;
			color:#101010;
			font-size: 0.12rem;
		}
		.userpl{
			margin-top:0.1rem;
			padding:0 0.1rem;
			font-size: 0.12rem;
			h4{
				font-size:0.16rem;
				font-weight: normal;
				color:#6C6C6C;

			}
			p{
				color:#A4A2A2;
			}
			  .growIntroduction{
				.introduction{
					margin-top:0.1rem;
				}
				.shoptext{
					margin-top:0.1rem;
					color:#000;
					font-size: 0.12rem;
				}
				.Introductionimg{
					width:100%;
					height:2rem;
					margin-top:0.1rem;
				}
			}
				.talkdiv{
					width: 3.95rem;
					height:1.55rem;
				}	
				.talkimg{
					margin-top:0.1rem;
					height:1.2rem;
					width:100%;
				}
			.commodity{
				height:0.5rem;
				background: #eee;
				margin-top:0.1rem;
				font-size: 0.14rem;
				text-align: center;
				line-height: 0.5rem;
			}	
		}
		.plnumber{
			margin:0;
		}
		.everyreview{
			color:#6C6C6C;
			height:0.52rem;
			display: flex;
			margin-top:0.12rem;
			.reviewimg{
				height:0.52rem;
				width:0.52rem;
				border-radius: 50%;
			}
			.reviewright{
				margin-left:0.1rem;
				h6{
					font-weight: normal;
					font-size: 0.14rem;
					line-height: 0.18rem;
					color:#000;
				}
				p{
					font-size: 0.12rem;
					line-height: 0.18rem;
				}
				span{
					color:#6C6C6C;
					margin:0;
					padding:0;
					line-height: 0.18rem;
				}
			}
			a{
				flex:1;
				text-align: right;
				line-height: 0.9rem;
				color:#000;
			}
		}
		.loadmore{
			width:100%;
			text-align: center;
		}
	}
</style>

